import React, { Component } from "react";
import { BrowserRouter, NavLink, Route } from "react-router-dom";
import Home from "./component/home";
import "./index.css";
export default class index extends Component {
  render() {
    return (
      <BrowserRouter>
        {/* 导航 */}
        <nav
          style={{
            fontSize: "40px",
            display: "flex",
            justifyContent: "space-evenly"
          }}
        >
          <NavLink to="/home">首页</NavLink>
          <NavLink
            to={{
              pathname: "/member",
              state: {
                name: "小明",
                age: 18
              }
            }}
          >
            会员
          </NavLink>
          <NavLink to="news">新闻页</NavLink>
        </nav>
        {/* 线路 */}
        <main>
          <Route path="/home" component={Home} />
          <Route path="/member" component={() => <div>我是会员</div>} />
          <Route path="/news" component={() => <div>我是新闻</div>} />
        </main>
      </BrowserRouter>
    );
  }
}
